import React, { useState } from "react";
import autos from "../views/auto.module.css";
import { useNavigate } from "react-router-dom";
import { Toast } from "antd-mobile";
import { logins } from "../api/login";
export default function Two() { 
  // 跳转传参  false不返回，true是返回
  let navigate = useNavigate();
  let tel = /^1[23456789]\d{9}$/;
  function jump() {
    navigate("/enroll", {
      replace: false,
      state: {
        id: 1,
      },
    });
  }
  // 账号输入框声明
  const [nun, setinp] = useState("");
  function numbers(event) {
    setinp(event.target.value);
    console.log(nun);
  }
  // 密码输入框声明
  const [pass, setpass] = useState("");
  function passwords(event) {
    setpass(event.target.value);
    console.log(pass);
  }
  // 登录
  function loginButton() {
    if (numbers.value == "" && passwords.value == "") {
      Toast.show({
        content: "请填写完整",
      });
    } else {
      if (tel.test(nun) == true) {
        console.log(nun);
        console.log(pass);
        logins({
          tel: nun,
          pass: pass,
        }).then((res) => {
          console.log(res);
          if (res.code == 1) {
            Toast.show({
              content: "登录成功",
            });
            setTimeout(() => {
              login_home();
              sessionStorage.setItem('dys',res.info.id)
              sessionStorage.setItem('dysInfo',res.info)
            }, 2000);
          } else {
            Toast.show({
              content: "登录失败",
            });
          }
        });
      } else {
        Toast.show({
          content: "请输入正确的手机号",
        });
      }
    }
  }
  // 登陆成功跳转首页
  function login_home() {
    navigate("/Home", {});
  }
  // 写结构可以写任意标签 需要写在div中或者空标签
  return (
    <div className={autos.big}>
      <h3>登录</h3>
      <div className={autos.login_input}>
        <div className={autos.login_inputNumber}>
          <input
            type="number"
            onChange={numbers}
            className={autos.number}
            placeholder="请输入手机号/用户名/邮箱"
          />
        </div>
        <div className={autos.login_inputPassword}>
          <input
            type="password"
            onChange={passwords}
            className={autos.password}
            placeholder="请输入密码"
          />
        </div>
      </div>
      <div className={autos.exempt_login}>
        <p>忘记密码</p>
        <p>免密码登录</p>
      </div>
      <div onClick={loginButton} className={autos.login}>
        登录
      </div>
      <div onClick={jump} className={autos.none_login}>
        <p>没有账号，去注册</p>
      </div>
      <div className={autos.login_three}>
        <div className={autos.login_threeimg}>
          <img src={require("../assets/img17526318aceb43840.png")} alt="" />
        </div>
      </div>
      <div className={autos.login_yes}>
        <p>登录即同意《用户服务协议》</p>
      </div>
    </div>
  );
}
